<script setup lang="ts">
  import { ref, watch } from 'vue';
  import { FormInstance, Message } from '@arco-design/web-vue';
  import useLoading from '@/hooks/loading';
  import Editor from '@/components/editor/index.vue';
  import {
    addPolicy,
    getgeoarea,
    getgeocity,
    getGeoProvice,
  } from '@/api/policy';
  import { getpolicydeplist, getpolicyIndex } from '@/api/dataCenter';
  const formRef = ref<FormInstance | null>(null);
  const props = defineProps({
    visible: Boolean,
    params: Object,
    industryAll: Array,
    directionAll: Array,
  });
  const provice = ref([]);
  const city = ref([]);
  const { loading, setLoading } = useLoading(false);
  const isShow = ref(true);
  defineOptions({
    name: 'addBackup',
  });
  const formType = ref();
  const allpolicyarea = ref();
  onMounted(() => {
    // 政策领域
    getGeoProvice().then((pro) => {
      provice.value = pro.data;
      formType.value = [
        {
          name: 'policy_title',
          label: '政策标题',
          type: 'a-input',
          fieldProps: {
            span: 24,
          },
          rules: [
            {
              required: true,
              message: '请输入',
            },
          ],
        },
        {
          name: 'policy_dept',
          label: '发布部门',
          type: 'a-input',
          fieldProps: {
            span: 24,
          },
          rules: [
            {
              required: true,
              message: '请输入',
            },
          ],
        },
        {
          name: 'original_link',
          label: '原文链接',
          type: 'a-input',
          fieldProps: {
            span: 24,
            placeholder: '例：https://kjj.luzhou.gov.cn/tzgg/content_1074796',
          },
          rules: [
            {
              required: true,
              message: '请输入',
            },
          ],
        },
        {
          name: 'province_id',
          label: '省',
          type: 'a-select',
          fieldProps: {
            span: 8,
            allowSearch: true,
            fieldNames: { value: 'id', label: 'name' },
          },
          selectOptions: pro.data,
          rules: [
            {
              message: '请选择',
              required: true,
            },
          ],
        },
        {
          name: 'city_id',
          label: '市',
          type: 'a-tree-select',
          fieldProps: {
            span: 8,
            allowSearch: true,
            fieldNames: { value: 'id', label: 'name' },
          },
          selectOptions: [],
          rules: [
            {
              message: '请选择',
              required: true,
            },
          ],
        },
        {
          name: 'area_id',
          label: '区县',
          type: 'a-select',
          fieldProps: {
            span: 8,
            fieldNames: { value: 'id', label: 'name' },
            allowSearch: true,
          },
          selectOptions: [],
          rules: [
            {
              message: '请选择',
              required: true,
            },
          ],
        },
        {
          name: 'policy_tags',
          label: '政策标签',
          type: 'a-input-tag',
          fieldProps: {
            span: 24,
            placeholder: '自定义添加，例：专精特新项目',
          },
          rules: [
            {
              required: false,
              message: '请输入',
            },
          ],
        },
        {
          label: '政策附件',
          name: 'policy_file',
          type: 'a-upload',
          fieldProps: {
            span: 24,
            action: 'global/upload',
            multiple: false,
            connectionName: 'doc_name',
          },
          rules: [
            {
              message: '请选择文件',
              required: false,
            },
          ],
        },
      ];
      getpolicyIndex({
        page_size: 10000,
      }).then((allpolicy) => {
        allpolicyarea.value = allpolicy.data.list;
        formType.value = [
          {
            name: 'policy_title',
            label: '政策标题',
            type: 'a-input',
            fieldProps: {
              span: 24,
            },
            rules: [
              {
                required: true,
                message: '请输入',
              },
            ],
          },
          {
            name: 'release_time',
            label: '发布时间',
            type: 'a-date-picker',
            fieldProps: {
              span: 24,
            },
            rules: [
              {
                required: true,
                message: '请输入',
              },
            ],
          },
          {
            name: 'policy_dept',
            label: '发布部门',
            type: 'a-input',
            fieldProps: {
              span: 24,
            },
            rules: [
              {
                required: true,
                message: '请输入',
              },
            ],
          },
          {
            name: 'original_link',
            label: '原文链接',
            type: 'a-input',
            fieldProps: {
              span: 24,
              placeholder: '例：https://kjj.luzhou.gov.cn/tzgg/content_1074796',
            },
            rules: [
              {
                required: false,
                message: '请输入',
              },
            ],
          },
          {
            name: 'policy_direction_id',
            label: '政策方向',
            type: 'a-select',
            selectOptions: props.directionAll,
            fieldProps: {
              span: 24,
              fieldNames: { value: 'direction_id', label: 'direction_name' },
              allowSearch: true,
              placeholder: '请选择',
            },
            rules: [
              {
                required: true,
                message: '请选择',
              },
            ],
          },
          {
            name: 'policy_industry_id',
            label: '政策行业',
            type: 'a-select',
            selectOptions: props.industryAll,
            fieldProps: {
              span: 24,
              fieldNames: { value: 'industry_id', label: 'industry_name' },
              allowSearch: true,
              placeholder: '请选择',
            },
            rules: [
              {
                required: true,
                message: '请选择',
              },
            ],
          },
          {
            name: 'policy_field_id',
            label: '政策领域',
            type: 'a-select',
            selectOptions: allpolicyarea.value,
            fieldProps: {
              span: 24,
              fieldNames: { value: 'field_id', label: 'field_name' },
              allowSearch: true,
              placeholder: '请选择',
            },
            rules: [
              {
                required: true,
                message: '请选择',
              },
            ],
          },
          {
            name: 'province_id',
            label: '省',
            type: 'a-select',
            fieldProps: {
              span: 8,
              allowSearch: true,
              fieldNames: { value: 'id', label: 'name' },
              placeholder: '请选择',
            },
            selectOptions: pro.data,
            rules: [
              {
                message: '请选择',
                required: true,
              },
            ],
          },
          {
            name: 'city_id',
            label: '市',
            type: 'a-tree-select',
            fieldProps: {
              span: 8,
              allowSearch: true,
              fieldNames: { value: 'id', label: 'name' },
              placeholder: '请选择',
            },
            selectOptions: [],
            rules: [
              {
                message: '请选择',
                required: true,
              },
            ],
          },
          {
            name: 'area_id',
            label: '区县',
            type: 'a-select',
            fieldProps: {
              span: 8,
              fieldNames: { value: 'id', label: 'name' },
              placeholder: '请选择',
              allowSearch: true,
            },
            selectOptions: [],
            rules: [
              {
                message: '请选择',
                required: true,
              },
            ],
          },
          {
            name: 'policy_tags',
            label: '政策标签',
            type: 'a-input-tag',
            fieldProps: {
              span: 24,
              placeholder: '自定义添加，例：专精特新项目',
            },
            rules: [
              {
                required: false,
                message: '请输入',
              },
            ],
          },
          {
            label: '政策附件',
            name: 'policy_file',
            type: 'a-upload',
            fieldProps: {
              span: 24,
              action: 'global/upload',
              multiple: false,
              connectionName: 'doc_name',
            },
            rules: [
              {
                message: '请选择文件',
                required: false,
              },
            ],
          },
          // {
          //   name: 'declare_start_time',
          //   label: '申报时间',
          //   type: 'a-range-picker',
          //   fieldProps: {
          //     span: 24,
          //   },
          //   rules: [
          //     {
          //       required: false,
          //       message: '请选择',
          //     },
          //   ],
          // },
        ];
      });
    });
  });
  const formData = ref({});
  const emit = defineEmits(['update:visible', 'refresh']);
  const handleSubmit = async () => {
    if (!(await formRef.value?.checkForm())) {
      try {
        setLoading(true);
        const dataForm = formRef.value?.formModel;
        let res = '';
        if (!content.value) {
          Message.error('请填写政策正文后添加！');
          setLoading(false);
          return false;
        }
        let fileUrl = '';
        if (dataForm?.policy_file) {
          fileUrl = dataForm?.policy_file[0].url
            ? dataForm?.policy_file[0].url
            : dataForm?.policy_file[0].response[0];
        }
        if (dataForm.policy_type == 1) {
          if (!dataForm.declare_start_time) {
            setLoading(false);
            Message.error('请选择申报时间');
            return false;
          }
          res = await addPolicy({
            policy_type: dataForm?.policy_type,
            policy_title: dataForm?.policy_title,
            policy_tags: dataForm?.policy_tags,
            declare_start_time: dataForm?.declare_start_time[0],
            declare_end_time: dataForm?.declare_start_time[1],
            original_link: dataForm?.original_link,
            policy_file: fileUrl,
            policy_dept_id: dataForm?.policy_dept_id,
            policy_field_id: dataForm?.policy_field_id,
            province_id: dataForm?.province_id,
            city_id: dataForm?.city_id,
            policy_industry_id: dataForm?.policy_industry_id,
            policy_direction_id: dataForm?.policy_direction_id,
            area_id: dataForm?.area_id,
            policy_content: content?.value,
          });
          Message.success(res.msg);
          emit('update:visible', false);
          emit('refresh');
        } else {
          res = await addPolicy({
            policy_type: dataForm?.policy_type,
            policy_title: dataForm?.policy_title,
            policy_tags: dataForm?.policy_tags,
            policy_dept: dataForm?.policy_dept,
            release_time: dataForm?.release_time,
            policy_dept_id: dataForm?.policy_dept_id,
            policy_field_id: dataForm?.policy_field_id,
            original_link: dataForm?.original_link,
            policy_file: fileUrl,
            policy_industry_id: dataForm?.policy_industry_id,
            policy_direction_id: dataForm?.policy_direction_id,
            province_id: dataForm?.province_id,
            city_id: dataForm?.city_id,
            area_id: dataForm?.area_id,
            policy_content: content?.value,
          });
          Message.success(res.msg);
          emit('update:visible', false);
          emit('refresh');
        }
      } catch (error) {
        // Message.error(error);
        setLoading(false);
      } finally {
        setLoading(false);
      }
    } else {
      Message.error('请正确填写表单！');
    }
  };

  const content = ref('');

  // 市
  watch(
    () => formRef.value?.formModel.province_id,
    (newVal) => {
      getgeocity({
        province_id: newVal,
      }).then((res) => {
        formRef.value?.setFormItm('area_id', '');
        formRef.value?.setFormItm('city_id', '');
        city.value = res.data;
        formType.value = [
          {
            name: 'policy_title',
            label: '政策标题',
            type: 'a-input',
            fieldProps: {
              span: 24,
            },
            rules: [
              {
                required: true,
                message: '请输入',
              },
            ],
          },
          {
            name: 'release_time',
            label: '发布时间',
            type: 'a-date-picker',
            fieldProps: {
              span: 24,
            },
            rules: [
              {
                required: true,
                message: '请输入',
              },
            ],
          },
          {
            name: 'policy_dept',
            label: '发布部门',
            type: 'a-input',
            fieldProps: {
              span: 24,
            },
            rules: [
              {
                required: true,
                message: '请输入',
              },
            ],
          },
          {
            name: 'original_link',
            label: '原文链接',
            type: 'a-input',
            fieldProps: {
              span: 24,
              placeholder: '例：https://kjj.luzhou.gov.cn/tzgg/content_1074796',
            },
            rules: [
              {
                required: true,
                message: '请输入',
              },
            ],
          },
          {
            name: 'policy_direction_id',
            label: '政策方向',
            type: 'a-select',
            selectOptions: props.directionAll,
            fieldProps: {
              span: 24,
              fieldNames: { value: 'direction_id', label: 'direction_name' },
              allowSearch: true,
              placeholder: '请选择',
            },
            rules: [
              {
                required: true,
                message: '请选择',
              },
            ],
          },
          {
            name: 'policy_industry_id',
            label: '政策行业',
            type: 'a-select',
            selectOptions: props.industryAll,
            fieldProps: {
              span: 24,
              fieldNames: { value: 'industry_id', label: 'industry_name' },
              allowSearch: true,
              placeholder: '请选择',
            },
            rules: [
              {
                required: true,
                message: '请选择',
              },
            ],
          },
          {
            name: 'policy_field_id',
            label: '政策领域',
            type: 'a-select',
            selectOptions: allpolicyarea.value,
            fieldProps: {
              span: 24,
              fieldNames: { value: 'field_id', label: 'field_name' },
              allowSearch: true,
              placeholder: '请选择',
            },
            rules: [
              {
                required: true,
                message: '请选择',
              },
            ],
          },
          {
            name: 'province_id',
            label: '省',
            type: 'a-select',
            fieldProps: {
              span: 8,
              allowSearch: true,
              fieldNames: { value: 'id', label: 'name' },
              placeholder: '请选择',
            },
            selectOptions: provice.value,
            rules: [
              {
                message: '请选择',
                required: true,
              },
            ],
          },
          {
            name: 'city_id',
            label: '市',
            type: 'a-select',
            fieldProps: {
              span: 8,
              allowSearch: true,
              placeholder: '请选择',
              fieldNames: { value: 'id', label: 'name' },
            },
            selectOptions: res.data,
            rules: [
              {
                message: '请选择',
                required: true,
              },
            ],
          },
          {
            name: 'area_id',
            label: '区县',
            type: 'a-select',
            fieldProps: {
              span: 8,
              placeholder: '请选择',
              fieldNames: { value: 'id', label: 'name' },
              allowSearch: true,
            },
            selectOptions: [],
            rules: [
              {
                message: '请选择',
                required: true,
              },
            ],
          },
          {
            name: 'policy_tags',
            label: '政策标签',
            type: 'a-input-tag',
            fieldProps: {
              span: 24,
              placeholder: '自定义添加，例：专精特新项目',
            },
            rules: [
              {
                required: false,
                message: '请输入',
              },
            ],
          },
          {
            label: '政策附件',
            name: 'policy_file',
            type: 'a-upload',
            fieldProps: {
              span: 24,
              action: 'global/upload',
              multiple: false,
              connectionName: 'doc_name',
            },
            rules: [
              {
                message: '请选择文件',
                required: false,
              },
            ],
          },
        ];
      });
    }
  );
  // 区
  watch(
    () => formRef.value?.formModel.city_id,
    (newVal) => {
      if (newVal) {
        getgeoarea({
          city_id: newVal,
        }).then((res) => {
          formRef.value?.setFormItm('area_id', '');
          formType.value = [
            {
              name: 'policy_title',
              label: '政策标题',
              type: 'a-input',
              fieldProps: {
                span: 24,
              },
              rules: [
                {
                  required: true,
                  message: '请输入',
                },
              ],
            },
            {
              name: 'release_time',
              label: '发布时间',
              type: 'a-date-picker',
              fieldProps: {
                span: 24,
              },
              rules: [
                {
                  required: true,
                  message: '请输入',
                },
              ],
            },
            {
              name: 'policy_dept',
              label: '发布部门',
              type: 'a-input',
              fieldProps: {
                span: 24,
              },
              rules: [
                {
                  required: true,
                  message: '请输入',
                },
              ],
            },
            {
              name: 'original_link',
              label: '原文链接',
              type: 'a-input',
              fieldProps: {
                span: 24,
                placeholder:
                  '例：https://kjj.luzhou.gov.cn/tzgg/content_1074796',
              },
              rules: [
                {
                  required: false,
                  message: '请输入',
                },
              ],
            },
            {
              name: 'policy_direction_id',
              label: '政策方向',
              type: 'a-select',
              selectOptions: props.directionAll,
              fieldProps: {
                span: 24,
                fieldNames: { value: 'direction_id', label: 'direction_name' },
                allowSearch: true,
                placeholder: '请选择',
              },
              rules: [
                {
                  required: true,
                  message: '请选择',
                },
              ],
            },
            {
              name: 'policy_industry_id',
              label: '政策行业',
              type: 'a-select',
              selectOptions: props.industryAll,
              fieldProps: {
                span: 24,
                fieldNames: { value: 'industry_id', label: 'industry_name' },
                allowSearch: true,
                placeholder: '请选择',
              },
              rules: [
                {
                  required: true,
                  message: '请选择',
                },
              ],
            },
            {
              name: 'policy_field_id',
              label: '政策领域',
              type: 'a-select',
              selectOptions: allpolicyarea.value,
              fieldProps: {
                span: 24,
                fieldNames: { value: 'field_id', label: 'field_name' },
                allowSearch: true,
                placeholder: '请选择',
              },
              rules: [
                {
                  required: true,
                  message: '请选择',
                },
              ],
            },
            {
              name: 'province_id',
              label: '省',
              type: 'a-select',
              fieldProps: {
                span: 8,
                allowSearch: true,
                fieldNames: { value: 'id', label: 'name' },
                placeholder: '请选择',
              },
              selectOptions: provice.value,
              rules: [
                {
                  message: '请选择',
                  required: true,
                },
              ],
            },
            {
              name: 'city_id',
              label: '市',
              type: 'a-select',
              fieldProps: {
                span: 8,
                allowSearch: true,
                fieldNames: { value: 'id', label: 'name' },
                placeholder: '请选择',
              },
              selectOptions: city.value,
              rules: [
                {
                  message: '请选择',
                  required: true,
                },
              ],
            },
            {
              name: 'area_id',
              label: '区县',
              type: 'a-select',
              fieldProps: {
                span: 8,
                fieldNames: { value: 'id', label: 'name' },
                placeholder: '请选择',
                allowSearch: true,
              },
              selectOptions: res.data,
              rules: [
                {
                  message: '请选择',
                  required: true,
                },
              ],
            },
            {
              name: 'policy_tags',
              label: '政策标签',
              type: 'a-input-tag',
              fieldProps: {
                span: 24,
                placeholder: '自定义添加，例：专精特新项目',
              },
              rules: [
                {
                  required: false,
                  message: '请输入',
                },
              ],
            },
            {
              label: '政策附件',
              name: 'policy_file',
              type: 'a-upload',
              fieldProps: {
                span: 24,
                action: 'global/upload',
                multiple: false,
                connectionName: 'doc_name',
              },
              rules: [
                {
                  message: '请选择文件',
                  required: false,
                },
              ],
            },
          ];
        });
      }
    }
  );
</script>

<template>
  <a-modal
    title="添加政策"
    :visible="visible"
    @ok="handleSubmit"
    title-align="start"
    :ok-loading="loading"
    width="95%"
    @cancel="
      () => {
        emit('update:visible', false);
      }
    "
  >
    <pro-form
      ref="formRef"
      hiddenBtn
      :form-json="formType"
      :form-data="formData"
    ></pro-form>
    <div class="titile">政策正文</div>
    <Editor v-model="content" style="margin-top: 10px" />
  </a-modal>
</template>

<style scoped lang="less">
  :deep(.arco-select-view-inner) {
    text-align: left !important;
  }
  .titile {
    margin-left: 12px;
    font-size: 13px;
    color: #4e5969;
  }
</style>
